@media only screen and (min-width: 300px) and (max-width: 400px) {
    html {
        font-size: 4.5px !important;
        height: 110%;

        &.IdentityVerification {
            .main-container {
                width: 94%;
            }
        }

        &.rightBlock1 {
            .main-container {
                width: 93%;
            }
        }

        &.chatBlock {
            .main-container {
                height: 130rem;
            }
        }

        .main-container {
            width: 90%;

            .bg1 {
                width: 70rem;
            }

            .bgCon {
                width: 70rem;
            }

            .bg2 {
                width: 36rem;
            }

            .bg3 {
                width: 36rem;
            }

            .rightConten2 .item {
                width: 15rem;
            }

            .rightConten2 .normalToolItem {
                margin-left: 2rem;
            }

            .rightContent3 {
                width: 70rem;
            }

            .rightContent3 .text {
                font-size: 3rem;
            }

            .rightContent3 .bottomContent .item {
                width: 8rem;
            }

            .arrow-right {
                width: 3rem;
                height: 2.5rem;
            }
        }

        /* 聊天界面 */
        .chatBlock.main-container {
            .list .tools .input .form-control {
                width: 35rem;
            }

            .list {
                height: 125rem;
            }
        }

        .rightBlock2.main-container {
            .list {
                height: 150rem;
            }
        }

        /* .identity-container */
        .identity-container {
            width: 72rem;

            form .form-box {
                width: 70rem;
            }

            form .form-box.bottom-bt .btn-block {
                width: 47rem;
            }
        }
    }
}

@media only screen and (min-width: 401px) and (max-width: 800px) {
    html {
        font-size: 4.5px !important;
        height: 132%;

        &.IdentityVerification {
            .main-container {
                width: 94%;
            }
        }

        &.rightBlock1 {
            .main-container {
                width: 72rem;
            }
        }

        &.chatBlock {
            .main-container {
                height: 130rem;
            }
        }

        .main-container {
            width: 90%;

            .bg1 {
                width: 70rem;
            }

            .bgCon {
                width: 70rem;
            }

            .bg2 {
                width: 36rem;
            }

            .bg3 {
                width: 36rem;
            }

            .rightConten2 .item {
                width: 15rem;
            }

            .rightConten2 .normalToolItem {
                margin-left: 2rem;
            }

            .rightContent3 {
                width: 70rem;
            }

            .rightContent3 .text {
                font-size: 3rem;
            }

            .rightContent3 .bottomContent .item {
                width: 8rem;
            }

            .arrow-right {
                width: 3rem;
                height: 2.5rem;
            }
        }

        /* 聊天界面 */
        .chatBlock.main-container {
            .list .tools .input .form-control {
                width: 35rem;
            }

            .list {
                height: 150rem;
            }
        }

        .rightBlock2.main-container {
            .list {
                height: 150rem;
            }
        }

        /* .identity-container */
        .identity-container {
            width: 72rem;

            form .form-box {
                width: 70rem;
            }

            form .form-box.bottom-bt .btn-block {
                width: 47rem;
            }
        }
    }
}

@media only screen and (min-width: 801px) and (max-width: 899px) {
    html {
        font-size: 4.5px !important;
        height: 120%;

        &.rightBlock1 {
            .main-container {
                width: 93%;
            }
        }
    }
}

@media only screen and (min-width: 360px) and (max-width: 675px) {
    html {
        font-size: 5px !important;

        .main-container {}
    }
}

// iPad Air 820*1180
// @media only screen and (min-width: 700px) and (max-width: 899px) {
//     html {
//         font-size: 6px !important;
//     }
// }

// @media only screen and (min-width: 882px) and (max-width: 899px) {
//     html {
//         font-size: 8px !important;
//     }
// }

// @media only screen and (min-width: 650px) and (max-width: 950px) {
//     html {
//         font-size: 8px !important;
//         overflow-y: scroll;
//     }
// }

@media only screen and (min-width: 650px) and (max-width: 800px) {
    html {
        font-size: 8px !important;
        // font-size: 9px !important;
        overflow-y: scroll;
    }
}

@media only screen and (min-width: 801px) and (max-width: 1049px) {
    html {
        font-size: 7px !important;
        // font-size: 9px !important;
        overflow-y: scroll;
    }
}

@media only screen and (min-width: 1050px) and (max-width: 1200px) {
    html {
        font-size: 9px !important;

        &.chatBlock {
            .main-container {
                height: 102rem;
            }
        }

        .rightBlock2.main-container {
            .list {
                height: 165rem;
            }
        }
    }
}

@media only screen and (min-width: 1200px) and (max-width: 1210px) {
    html {
        .rightBlock2.main-container {
            .list {
                height: 96rem;
            }
        }

        &.chatBlock {
            .main-container {
                height: 102rem;

                .tools {
                    .input .form-control {
                        width: 87rem;
                    }
                }
            }
        }
    }
}

@media only screen and (min-width: 1220px) and (max-width: 1300px) {
    html {
        height: 120%;
    }

    /* 聊天界面 */
    .chatBlock.main-container {
        .list .tools .input .form-control {
            width: 60rem;
        }

        .list {
            height: 85rem;
        }
    }
}

@media only screen and (min-width: 1301px) and (max-width: 1699px) {
    html {
        body {
            height: 100%;
        }
    }

    /* 聊天界面 */
    .chatBlock.main-container {
        .list .tools .input .form-control {
            width: 60rem;
        }

        .list {
            height: 85rem;
        }
    }
}

@media only screen and (min-width: 1700px) {
    .chatBlock.main-container {

        // .list .tools .input .form-control {
        //     width: 60rem;
        // }
        .list {
            height: 77rem;

            .chat {
                height: 60rem;
            }
        }
    }
}

// 竖屏 portrait
// ...

// 横屏 landscape
@media only screen and (orientation: landscape) and (min-width: 1024px) and (max-width: 1599px) {
    html {
        // font-size: 5px;
        font-size: 9px;
        height: 158%;

        &.rightBlock1 {
            height: 200%;
        }

        &.rightBlock2 {
            height: 280%;
        }
    }
}

@media only screen and (min-width: 1600px) and (max-width: 1920px) {
    html {
        font-size: 10px !important;

        .main-container {
            width: 120rem;
            // width: 100%;
            // width: 56%;
        }
    }
}

@media only screen and (min-width: 1921px) and (max-width: 3000px) {
    html {
        font-size: 13px !important;
        height: 148%;

        &.rightBlock1 {
            height: 200%;
        }

        .main-container {
            width: 90%;
        }

        .rightBlock2.main-container {
            .list {
                height: 82rem;
            }
        }
    }
}